//@ts-nocheck
import React, { useEffect, useState } from 'react';
import { history, useLocation } from 'umi';
import { NavBar, DropdownMenu, Cell, Switch } from 'react-vant';
import './index.less';
import '@/pages/golobo.less';
import 'lib-flexible';
import maoyan from './img/猫眼Logo.png';
import bxqyys from '../../static/56898.png';
import { Arrow } from '@react-vant/icons';
import { Tabs } from 'antd-mobile';
import { option1 } from './options.tsx';
import { useLocale } from 'antd/es/locale';
import axios from 'axios';
import Item from 'antd/es/list/Item';

export default function index() {
  const [value, setValue] = useState<Record<string, string | number>>({});
  const [show, setshow] = useState(false);
  const location = useLocation();
  const data = location.state.item;
  // console.log(data, 'data');

  useEffect(() => {
    document.addEventListener('scroll', scrolltop);
    // console.log(location, '123');
  }, []);

  const scrolltop = () => {
    const top = document.documentElement.scrollTop;
    // const top = window.pageYOffset
    if (top <= 0) {
      setshow(false);
    } else {
      setshow(true);
    }
  };

  const handlescroll = () => {
    // document.body.scrollTop = document.documentElement.scrollTop = 0
    // 设置了回到顶部时动画效果
    window.scrollTo({
      top: 0,
      behavior: 'smooth',
    });
  };

  //点击跳转电影页面
  let vb = () => {
    history.push('/details');
  };

  //跳转电影页面
  let dynbla = () => {
    history.push('/films');
  };

  //跳转选择影厅页面
  let cinemass = () => {
    history.push('/cinema');
  };

  return (
    <div
      className="lhjvbdn"
      style={{ width: '100%', height: '100%', backgroundColor: '' }}
    >
      <div className="fbmfgbv">
        <NavBar
          title={data.paly_id.name}
          leftText="返回"
          onClickLeft={dynbla}
        />
      </div>
      <div
        className="fbsafg"
        style={{
          width: '100%',
          height: '1.5rem',
          backgroundColor: 'white',
          lineHeight: '1.5rem',
        }}
      >
        <img
          src={maoyan}
          alt=""
          style={{ padding: '0.2rem', borderRadius: '0.8rem' }}
          className="mylogo"
        />
        <h5
          className="mmyyan"
          style={{
            marginLeft: '1.5rem',
            marginTop: '-2.2rem',
            color: '#f35d58',
            fontSize: '0.8rem',
            height: '1.5rem',
            lineHeight: '1.5rem',
          }}
        >
          猫眼
        </h5>
        <p
          className="jiujiujiu"
          style={{
            marginLeft: '7rem',
            marginTop: '-1.4rem',
            fontSize: '0.3rem',
            fontWeight: 'bold',
          }}
        >
          19.9元起购票
        </p>
      </div>
      <div
        className="ghnbfd"
        style={{ width: '100%', height: '4.5rem', backgroundColor: '#393939' }}
      >
        <img
          src={data.paly_id.image}
          alt=""
          className="nbcmfd"
          style={{
            padding: '0.1rem',
            height: '160px',
            width: '123.5px',
            lineHeight: '160px',
            marginLeft: '0.2rem',
          }}
        />
        <h5
          className="vbndhal"
          style={{
            marginLeft: '4rem',
            marginTop: '-4.5rem',
            fontSize: '0.6rem',
            color: 'white',
            left: '15px',
          }}
        >
          {data.paly_id.name}
        </h5>
        <p
          className="mbnfkds"
          style={{
            fontSize: '0.4rem',
            marginLeft: '4rem',
            marginTop: '0.05rem',
            color: '#dadada',
          }}
        >
          Fast X
        </p>

        <p
          className="mbnfkdss"
          style={{
            fontSize: '0.35rem',
            marginLeft: '4rem',
            marginTop: '0.05rem',
            color: '#dadada',
          }}
        >
          {data.paly_id.type} {data.paly_id.pin_numL}D IMAX
        </p>
        <p
          className="mbnfkdsd"
          style={{
            fontSize: '0.35rem',
            marginLeft: '4rem',
            marginTop: '0.05rem',
            color: '#dadada',
          }}
        >
          美国/141分钟
        </p>
        <p
          className="mbnfkdsf"
          style={{
            fontSize: '0.35rem',
            marginLeft: '4rem',
            marginTop: '0.05rem',
            color: '#dadada',
          }}
        >
          2023-05-17中国大陆上映
        </p>
        <p
          className="mbnfkdsa"
          style={{
            fontSize: '0.4rem',
            marginLeft: '4rem',
            color: 'yellow',
            fontWeight: 'bold',
          }}
        >
          <span
            style={{ color: 'white', fontSize: '0.35rem', fontWeight: '600' }}
          >
            观众评
          </span>{' '}
          8.9 (14.7万人评)
        </p>
        <p
          className="jianhaos"
          style={{ marginLeft: '9rem', marginTop: '-3.3rem' }}
          onClick={() => {
            vb();
          }}
        >
          <Arrow style={{ color: '#dadada', fontSize: '0.5rem' }} />
        </p>
      </div>
      <div
        className="fgcnx"
        style={{ width: '100%', height: '1.1rem', backgroundColor: '' }}
      >
        <Tabs defaultActiveKey="1">
          <Tabs.Tab title="5月27日" key="1"></Tabs.Tab>
          <Tabs.Tab title="5月28日" key="2"></Tabs.Tab>
          <Tabs.Tab title="5月29日" key="3"></Tabs.Tab>
          <Tabs.Tab title="5月30日" key="4"></Tabs.Tab>
          <Tabs.Tab title="5月31日" key="5"></Tabs.Tab>
          <Tabs.Tab title="6月01日" key="6"></Tabs.Tab>
          <Tabs.Tab title="6月02日" key="7"></Tabs.Tab>
          <Tabs.Tab title="6月03日" key="8"></Tabs.Tab>
          <Tabs.Tab title="6月04日" key="9"></Tabs.Tab>
          <Tabs.Tab title="6月05日" key="10"></Tabs.Tab>
        </Tabs>
      </div>
      <div className="demosfull">
        <DropdownMenu value={value} onChange={(v) => setValue(v)}>
          <DropdownMenu.Item name="value1" options={option1} />
          <DropdownMenu.Item title="品牌" name="value2">
            <Cell center title="万达影城" rightIcon={<Switch size={24} />} />
            <Cell center title="金棕榈影城" rightIcon={<Switch size={24} />} />
            <Cell center title="大世界影城" rightIcon={<Switch size={24} />} />
          </DropdownMenu.Item>
          <DropdownMenu.Item title="筛选" name="value3">
            <Cell center title="影城服务" rightIcon={<Switch size={24} />} />
            <Cell center title="放映语言" rightIcon={<Switch size={24} />} />
            <Cell center title="影片版本" rightIcon={<Switch size={24} />} />
            <Cell center title="影厅类型" rightIcon={<Switch size={24} />} />
          </DropdownMenu.Item>
        </DropdownMenu>
      </div>
      <div
        className="neirongas"
        style={{ width: '100%', height: '16rem', backgroundColor: '' }}
      >
        <div
          className="mbndksa"
          style={{ width: '100%', height: '4rem', backgroundColor: '' }}
          onClick={() => {
            cinemass();
          }}
        >
          <h3 className="wandasgf" style={{ padding: '0.3rem' }}>
            万达影城(嘉德万达广场PRIME店)
          </h3>
          <p
            className="lianchiqu"
            style={{ padding: '0.3rem', marginTop: '-0.5rem' }}
          >
            莲池区三丰东路246号嘉德万达广场4F-A
          </p>
          <div className="gai">
            <span
              className="gaiqians"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.3rem',
                // position: 'relative',
                // top: '-10%',
              }}
            >
              改签
            </span>
            <span
              className="gaiqianss"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansd"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansf"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansg"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
          </div>
          <div className="left">
            <p
              className="kaikazl"
              style={{
                padding: '0.3rem',
                color: 'silver',
                marginTop: '-0.1rem',
              }}
            >
              开卡赠礼，享1分钱看IMAX
            </p>
            <p
              className="jinqicc"
              style={{
                padding: '0.3rem',
                marginTop: '-0.6rem',
                color: 'silver',
              }}
            >
              近期场次:12:40 | 13:35 | 14:20
            </p>
          </div>
          <div className="right">
            <p className="yuanqif">25 元起</p>
            <p className="qianmilk">1.2KM</p>
          </div>
        </div>
        <hr />
        <div
          className="mbndksa"
          style={{ width: '100%', height: '4rem', backgroundColor: '' }}
        >
          <h3 className="wandasgf" style={{ padding: '0.3rem' }}>
            大世界影城(竞秀广场PRIME店)
          </h3>
          <p
            className="lianchiqu"
            style={{ padding: '0.3rem', marginTop: '-0.5rem' }}
          >
            莲池区三丰东路246号嘉德万达广场4F-A
          </p>
          <div className="gai">
            <span
              className="gaiqians"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.3rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqianss"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansd"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansf"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansg"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
          </div>
          <div className="left">
            <p
              className="kaikazl"
              style={{
                padding: '0.3rem',
                color: 'silver',
                marginTop: '-0.1rem',
              }}
            >
              开卡赠礼，享1分钱看IMAX
            </p>
            <p
              className="jinqicc"
              style={{
                padding: '0.3rem',
                marginTop: '-0.6rem',
                color: 'silver',
              }}
            >
              近期场次:12:40 | 13:35 | 14:20
            </p>
          </div>
          <div className="right">
            <p className="yuanqif">28 元起</p>
            <p className="qianmilk">1.6KM</p>
          </div>
        </div>
        <hr />
        <div
          className="mbndksa"
          style={{ width: '100%', height: '4rem', backgroundColor: '' }}
        >
          <h3 className="wandasgf" style={{ padding: '0.3rem' }}>
            保定金雄国际影城DOLBY(银座店)
          </h3>
          <p
            className="lianchiqu"
            style={{ padding: '0.3rem', marginTop: '-0.5rem' }}
          >
            莲池区三丰东路246号嘉德万达广场4F-A
          </p>
          <div className="gai">
            <span
              className="gaiqians"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.3rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqianss"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansd"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansf"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansg"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
          </div>
          <div className="left">
            <p
              className="kaikazl"
              style={{
                padding: '0.3rem',
                marginTop: '-0.1rem',
                color: 'silver',
              }}
            >
              开卡赠礼，享1分钱看IMAX
            </p>
            <p
              className="jinqicc"
              style={{
                padding: '0.3rem',
                marginTop: '-0.6rem',
                color: 'silver',
              }}
            >
              近期场次:12:40 | 13:35 | 14:20
            </p>
          </div>
          <div className="right">
            <p className="yuanqif">23 元起</p>
            <p className="qianmilk">1.8KM</p>
          </div>
        </div>
        <hr />
        <div
          className="mbndksa"
          style={{ width: '100%', height: '4rem', backgroundColor: '' }}
        >
          <h3 className="wandasgf" style={{ padding: '0.3rem' }}>
            华隶影城CINITY120帧 (华创店)
          </h3>
          <p
            className="lianchiqu"
            style={{ padding: '0.3rem', marginTop: '-0.5rem' }}
          >
            莲池区三丰东路246号嘉德万达广场4F-A
          </p>
          <div className="gai">
            <span
              className="gaiqians"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.3rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqianss"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansd"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansf"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansg"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
          </div>
          <div className="left">
            <p
              className="kaikazl"
              style={{
                padding: '0.3rem',
                marginTop: '-0.1rem',
                color: 'silver',
              }}
            >
              开卡赠礼，享1分钱看IMAX
            </p>
            <p
              className="jinqicc"
              style={{
                padding: '0.3rem',
                marginTop: '-0.6rem',
                color: 'silver',
              }}
            >
              近期场次:12:40 | 13:35 | 14:20
            </p>
          </div>
          <div className="right">
            <p className="yuanqif">28 元起</p>
            <p className="qianmilk">2.4KM</p>
          </div>
        </div>
        <hr />
        <div
          className="mbndksa"
          style={{ width: '100%', height: '4rem', backgroundColor: '' }}
        >
          <h3 className="wandasgf" style={{ padding: '0.3rem' }}>
            聚点影城DOLBY (惠友十方店)
          </h3>
          <p
            className="lianchiqu"
            style={{ padding: '0.3rem', marginTop: '-0.5rem' }}
          >
            莲池区三丰东路246号嘉德万达广场4F-A
          </p>
          <div className="gai">
            <span
              className="gaiqians"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.3rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqianss"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansd"
              style={{
                border: ' #ffb240 solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansf"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
            <span
              className="gaiqiansg"
              style={{
                border: ' #7da9af solid',
                marginLeft: '0.2rem',
              }}
            >
              改签
            </span>
          </div>
          <div className="left">
            <p
              className="kaikazl"
              style={{
                padding: '0.3rem',
                marginTop: '-0.1rem',
                color: 'silver',
              }}
            >
              开卡赠礼，享1分钱看IMAX
            </p>
            <p
              className="jinqicc"
              style={{
                padding: '0.3rem',
                marginTop: '-0.6rem',
                color: 'silver',
              }}
            >
              近期场次:12:40 | 13:35 | 14:20
            </p>
          </div>
          <div className="right">
            <p className="yuanqif">28 元起</p>
            <p className="qianmilk">2.4KM</p>
          </div>
        </div>
        <hr />
      </div>
      <button className={show ? 'ups' : 'up'} onClick={handlescroll}>
        ↑
      </button>
    </div>
  );
}
